<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="font_2017946_s214p6oou4e/iconfont.css">
    <link rel="stylesheet" type="text/css" href="css/index.css" />
</head>

<body>
    <div class="header">
        <div class="header-con">
            <div class="header-first">
                <ul>
                    <li><a href="" class="first">amigo账号登录</a></li>
                    <li><a href="http://10.35.162.123/jinlixiangmu/denglu.html">原账号登录</a></li>
                    <li><a href="http://10.35.162.123/jinlixiangmu/zhuce.html">注册</a></li>
                    <li><a href="" class="iconfont icon-gouwuche last">购物车(0)</a>
                        <div class="dtext">
                            您的购物车是空的，快去挑选喜欢的商品吧！
                        </div>
                    </li>
                </ul>
            </div>
            <img src="img/images/1_03.png" />
            <div class="login">
                <ul>
                    <li><a href="">首页</a></li>
                    <li class="omo"><a href="" class="titt">手机</a>
                        <div class="topp">
                            <div class="topp-con">
                                <div class="three">
                                    <a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">最新&gt;</a>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S11S</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S11</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立M7 Plus</a</p> <p><a href="">金立M7</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">大金刚2</a></p>
                                </div>
                                <div class="two">
                                    <a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">M系列&gt;</a>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立M7 Plus</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立M6S Plus</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立M2017</a</p> <p><a href="">金立M6 Plus</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立M6</a></p>
                                </div>
                                <div class="three">
                                    <a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">S系列&gt;</a>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S11S</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S11</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S10</a</p>
									<p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S108</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立S10C</a></p>
                                </div>
                                <div class="four">
                                    <a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">金刚系列&gt;</a>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金刚3</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金刚2</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">大金刚2</a</p> </div> <div class="five">
											<a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">天鉴系列&gt;</a>
                                        <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">天鉴W909</a></p>
                                </div>
                                <div class="six">
                                    <a href="http://10.35.162.123/jinlixiangmu/liebiao.html" class="nfn">F系列&gt;</a>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立F6</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立F109</a></p>
                                    <p><a href="http://10.35.162.123/jinlixiangmu/liebiao.html">金立F109L</a</p> </div> </div> </div>
						</li>
						<li><a href="">配件</a></li>
                    <li><a href="">服务</a></li>
                    <li><a href="">下载</a></li>
                    <li><a href="">amigoOS</a></li>
                    <li class="dactor"><input id="goid" placeholder="输入搜索内容" />
                        <a href="" class="iconfont icon-search"></a>
                    </li>
                </ul>
                </div>
                </div>
                </div>

                <div id="wrap">
                    <ul id="imgWrap" style="margin-left:0;">
                        <li><img src="img/images/big1.jpg" alt=""></li>
                        <li><img src="img/images/big2.jpg" alt=""></li>
                        <li><img src="img/images/big3.jpg" alt=""></li>
                        <li><img src="img/images/big4.jpg" alt=""></li>
                        <li><img src="img/images/big5.jpg" alt=""></li>
                        <li><img src="img/images/big1.jpg" alt=""></li>
                    </ul>
                    <img src="img/images/left.png" alt="" id="prev">
                    <img src="img/images/right.png" alt="" id="next">
                </div>
                <ul id="dotWrap">
                </ul>
                <div id="count">
                    <div id="count-con">
                        <h2>明星产品</h2>
                        <ul>
                            <li><img src="img/images/28_1514454113062.jpg"></li>
                            <li><img src="img/images/19_1516348649876.jpg"></li>
                            <li><img src="img/images/28_1514454181297.jpg"></li>
                        </ul>
                    </div>
                </div>
                <div id="counter">
                    <div id="counter-con">
                        <h2>热卖推荐</h2>
                        <img src="img/images/05_1520212662703.jpg">
                        <ul class="counon">
                            <li><img src="img/images/F12PRO.png">
                                <h4>金立F12PRO</h4>
                                <p>5.7英寸高清大屏水滴手机</p><b>¥1999</b>
                            </li>
                            <li><img src="img/images/F40%20(1).png">
                                <h4>金立F40</h4>
                                <p>6.8英寸高清大屏水滴手机</p><b>¥2699</b>
                            </li>
                            <li><img src="img/images/F7.png">
                                <h4>金立F7</h4>
                                <p>6.53英寸高清大屏水滴手机</p><b>¥1699</b>
                            </li>
                            <li><img src="img/images/K40PRO%20(1).png">
                                <h4>金立K40Pro</h4>
                                <p>6.8英寸高清大屏水滴手机</p><b>¥3299</b>
                            </li>
                            <li><img src="img/images/K40S%20(1).png">
                                <h4>金立K40S</h4>
                                <p>6.217英寸高清大屏水滴手机</p><b>¥1499</b>
                            </li>
                            <li><img src="img/images/K6.png">
                                <h4>金立K6</h4>
                                <p>6.21英寸高清大屏水滴手机</p><b>¥2299</b>
                            </li>
                        </ul>
                        <ul class="aounon">
                            <li class="first"><img src="img/images/M30PRO.png">
                                <h4>金立M30PRO</h4>
                                <p>6.53英寸高清大屏水滴手机</p><b>¥2899</b>
                            </li>
                            <li><img src="img/images/K6.png">
                                <h4>金立K6</h4>
                                <p>6.21英寸高清大屏水滴手机</p><b>¥1599</b>
                            </li>
                            <li><img src="img/images/M30PRO.png">
                                <h4>金立M40PRO</h4>
                                <p>6.53英寸高清大屏水滴手机</p><b>¥2999</b>
                            </li>
                            <li><img src="img/images/M40PRO.png">
                                <h4>金立M30PRO</h4>
                                <p>6.53英寸高清大屏水滴手机</p><b>¥2899</b>
                            </li>
                        </ul>
                    </div>
                </div>
                <div id="font">
                    <div id="font-con">
                        <h2>精美配件</h2>
                        <ul>
                            <li><img src="img/images/28_1514453044261.jpg">
                                <div id="font-on">
                                    <h3>线控自拍杆</h3>
                                    <p>迷你携带,线控美拍</p>
                                    <b>¥49</b>
                                </div>
                            </li>
                            <li><img src="img/images/28_1514453089776.jpg">
                                <div id="font-on">
                                    <h3>Micor USB数据线</h3>
                                    <p>高速数据传输</p>
                                    <b>¥20</b>
                                </div>
                            </li>
                            <li><img src="img/images/28_1514453140686.jpg">
                                <div id="font-on">
                                    <h3>旅行充电器</h3>
                                    <p>流线腰身，高效充电</p>
                                    <b>¥40</b>
                                </div>
                            </li>
                            <li><img src="img/images/28_1514453165062.jpg">
                                <div id="font-on">
                                    <h3>快速充电头</h3>
                                    <p>高效快充，安全节能</p>
                                    <b>¥69</b>
                                </div>
                            </li>
                            <li><img src="img/images/28_1514453197940.jpg">
                                <div id="font-on">
                                    <h3>HiFi耳机</h3>
                                    <p>HI-FI魔音，震撼享受</p>
                                    <b>¥69</b>
                                </div>
                            </li>
                            <li><img src="img/images/28_1514453223487.jpg">
                                <div id="font-on">
                                    <h3>贴膜</h3>
                                    <p>高清透光，耐磨防油污</p>
                                    <b>¥10</b>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div id="fonter">
                    <div id="fonter-con">
                        <h2>品牌动态</h2>
                        <ul>
                            <li><img src="img/images/01_1517453309499.jpg"></li>
                            <li><img src="img/images/01_1517453664732.jpg"></li>
                            <li><img src="img/images/01_1517453382045.jpg"></li>
                        </ul>
                    </div>
                </div>
                <div id="lasts">
                    <div id="lasts-con">
                        <ul>
                            <li><img src="img/images/D-_userAJAX_htdocs_二生三_img_金立_03.png"></li>
                            <li><img src="img/images/金立_04.png"></li>
                            <li><img src="img/images/D-_userAJAX_htdocs_二生三_img_金立_03.png"></li>
                            <li><img src="img/images/金立_04.png"></li>
                        </ul>
                    </div>
                </div>
                <div class="fonterr">
                    <div class="fonterr-con">
                        <div class="one">
                            <h5>关于金立</h5>
                            <p>企业荣誉</p>
                            <p>金立体验店</p>
                            <p>代理商专区</p>
                            <p>加入金立</p>
                            <p>联系我们</p>
                            <p>供应/服务商需求咨询</p>
                        </div>
                        <div class="two">
                            <h5>新闻咨询</h5>
                            <p>公司新闻</p>
                            <p>媒体报道</p>

                        </div>
                        <div class="three">
                            <h5>购物指南</h5>
                            <p>购物流程</p>
                            <p>支付方式</p>
                            <p>配送说明及费用</p>
                            <p>订单管理</p>
                            <p>购买常见问题</p>
                            <p>预置应用公示</p>
                        </div>
                        <div class="four">
                            <h5>售后服务</h5>
                            <p>售后政策</p>
                            <p>售后服务网点</p>
                            <p>上门维修</p>
                            <p>签收须知</p>
                            <p>物流查询</p>
                        </div>
                        <div class="five">
                            <h5>关注我们</h5>
                            <p class="iconfont icon-weibo">&nbsp;新浪微博</p>
                            <p class="iconfont icon-tengxunweibo">&nbsp;腾讯微博</p>
                            <p class="iconfont icon-qzone">&nbsp;QQ空间</p>

                        </div>
                        <img src="img/images/code.png" />
                        <span>扫一扫关注微信</span>
                    </div>
                </div>


                <div id="zuihou-con">
                    <div id="zuihou">
                        <ul>
                            <li><span class="one">网站地图&nbsp;&nbsp;|</span><span>&nbsp;&nbsp;集团下属公司</span></li>
                            <li>增值电信业务经营许可证：粤B2-20120350 粤ICP备05087105号 粤文网[2018]10835-3804号 粤文审[2012]196号</li>
                            <li>Copyright &copy;2013 深圳市金立通信设备有限公司 版权所有.</li>
                        </ul>
                        <div id="imgs">
                            <img src="img/images/sf.png">
                            <img src="img/images/govIcon.gif" class="two">
                            <img src="img/images/b.png">
                        </div>
                        <div class="last">中国/简体中文+</div>
                    </div>
                </div>

</body>

</html>
<script src="jquery.min.js"></script>
<script>
    // 鼠标滑过购物车出现下拉菜单
    $(".last").mouseenter(function() {
        $(".dtext").slideDown()
    })
    $(".dtext").mouseleave(function() {
        $(".dtext").slideUp()
    })
    $(".dtext").mouseenter(function() {
        $(".last").stop()
    })



    // 轮播图
    let oUl = $("#imgWrap");
    let imgList = $("#imgWrap li")
    let dotWrap = $("#dotWrap")
    let n = 0;
    imgList.each(() => {
        $("<li></li>").appendTo(dotWrap)
    })
    let dotList = $("#dotWrap li");
    dotList.eq(0).addClass("focus")


    function change() {
        oUl.animate({
            marginLeft: -(1450 * n)
        }, 2000)
        dotList.removeClass("focus")
        dotList.eq(n).addClass("focus")
    }
    $("#next").click(function() {
        // alert("1")

        if (n !== imgList.length - 1) {
            n++;
            change()
        } else {
            n = 0;
            let virtualDom = imgList.eq(0).clone();

            virtualDom.appendTo(oUl);
            oUl.animate({
                marginLeft: imgList.length * -1450
            }, function() {
                virtualDom.remove();
                oUl.css({
                    marginLeft: 0
                })
            })
            dotList.removeClass("focus").eq(n).addClass("focus")
        }

    })
    $("#prev").click(function() {
        // alert("1")

        if (n !== 0) {
            n--;
            change()
        } else {
            n = imgList.length - 1;
            let virtualDom = imgList.eq(imgList.length - 1).clone();
            virtualDom.prependTo(oUl);
            oUl.css({
                marginLeft: -1450
            }).animate({
                marginLeft: 0
            }, function() {
                virtualDom.remove();
                oUl.css({
                    marginLeft: (imgList.length - 1) * -1450
                })
            })
            dotList.removeClass("focus").eq(n).addClass("focus")
        }

    })
    dotList.click(function() {
        n = $(this).index();
        change()
    })


    // 鼠标滑过二级导航出现
    $(".omo").mousemove(function() {
        $(".topp").fadeIn()
    })
    $(".omo").mouseleave(function() {
        $(".topp").fadeOut()
    })
</script>